
import React, { forwardRef, useState, useImperativeHandle, useEffect } from 'react';
import { Select } from 'antd';
import CodeEditor from '@uiw/react-textarea-code-editor';


const { Option } = Select

export const ProblemRight = forwardRef((props, ref) => {
    const [selectvalue, setSelectvalue] = useState("java")
    const [code, setCode] = useState(
        `import java.util.Scanner;\n/**\n * @author Hyperion\n * @date 2021/11/28\n */\npublic class Main {\npublic static void main(String[] args) {\nString name = \"Hyperion\";\nScanner in = new Scanner(System.in);\n int[] abc = new int[10000000];\nint t = 0, a = 0, b = 0;\nSystem.out.println(name);\nt = in.nextInt();\nwhile(t-- > 0){\na = in.nextInt();\nb = in.nextInt();\nSystem.out.println(a + b);\n}\nSystem.out.println(name);\n}\n}`
    );
    useImperativeHandle(ref, () => ({
        selectvalue,
        code
    }));
    useEffect(()=>{

    }, [selectvalue, code])
    return (
        <div>
            <div>
                <Select style={{ width: "116px", padding: "3px 8px" }} defaultValue="java" onSelect={(value) => setSelectvalue(value)}>
                    <Option value="js">javascript</Option>
                    <Option value="java">java</Option>
                    <Option value="c++">c++</Option>
                    <Option value="c">c</Option>
                    <Option value="golang">golang</Option>
                    <Option value="node">node</Option>
                </Select>
            </div>
            <div>
                <CodeEditor
                    value={code}
                    language="js"
                    placeholder={`Please enter ${selectvalue} code`}
                    onChange={(evn) => setCode(evn.target.value)}
                    // padding={15}
                    minHeight="calc(100vh - 90px)"
                    style={{
                        fontSize: 12,
                        backgroundColor: "#f5f5f5",
                        fontFamily: 'ui-monospace,SFMono-Regular,SF Mono,Consolas,Liberation Mono,Menlo,monospace',
                        overflowY: scroll,
                        border: "1px solid #e1e1e1"
                    }}
                />

            </div>
        </div>


    )}
)

